<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <link rel='stylesheet' href='/css/lib/normalize.css' />
    <link rel='stylesheet' href='/css/index.css' />
  </head>
  <body>
  <div class="play-container">
  	<div class="play-list">
  	<ul id="play-list">
	  	<% lists.forEach(function(file){ %>
	  	  <li title="<%= file %>"><%= file %></li>
	  	<%	}) %>
  	</ul>
  	</div>
  	<div class="play-control">
  		<div class="time"></div>
  		<div class="btn-box">
  			<div class="start">开始</div>
  			<div class="stop">暂停</div>
  		</div>
  	</div>
  	<div class="play-analy">
      <div id="timeDomain" class="btn">时域图</div>
      <div id="timeDomain" class="btn">频域图</div>
      <div id="stop1" class="btn">停止动画</div>
      <canvas id="canvas" width="800" height="300" style="border:1px solid rgb(133, 217, 247)"></canvas>
      <div id="stop2" class="btn">停止动画</div>
      <canvas id="canvasCircle" width="1200" height="1200" style="border:1px solid rgb(133, 217, 247)"></canvas>
  	</div>
  </div>
  <script type="text/javascript" src="/js/lib/jquery-2.1.3.min.js"></script>
  <script src="http://cdn.bootcss.com/EaselJS/0.8.0/easeljs.min.js"></script>
  <script type="text/javascript" src="/js/index.min.js"></script>
  <script type="text/javascript" src="/js/createjsEffect.min.js"></script>
  </body>
</html>
